<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8" />
    <title>YINGHAI</title>
    <link rel="shortcut icon" href="img/icon.png" />
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/5.0.0/normalize.min.css" />
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.css" />
    <link rel="stylesheet" href="css/style.css" />
    <link rel="stylesheet" href="css/img-gallery.css" />
    <script src="https://cdnjs.cloudflare.com/ajax/libs/prefixfree/1.0.7/prefixfree.min.js"></script>
    <script src="js/jquery-3.6.0.js"></script>
    <script src="js/script.js"></script>
</head>

<body>
    <!-- partial:index.partial.html -->
    <div class="ct" id="t1">
        <div class="ct" id="t2">
            <div class="ct" id="t3">
                <div class="ct" id="t4">
                    <div class="ct" id="t5">
                        <div class="ct" id="t6">
                            <ul id="menu">
                                <a href="#t1">
                                    <li class="icon fa fa-bolt" id="home"></li>
                                </a>
                                <a href="#t2">
                                    <li class="icon fa fa-keyboard-o" id="blog"></li>
                                </a>
                                <a href="#t3">
                                    <li class="icon fa fa-folder" id="project"></li>
                                </a>
                                <a href="#t4">
                                    <li class="icon fa fa-picture-o" id="art"></li>
                                </a>
                                <a href="#t5">
                                    <li class="icon fa fa-camera-retro" id="camera"></li>
                                </a>
                                <a href="#t6">
                                    <li class="icon fa fa-plus-circle" id="more"></li>
                                </a>
                            </ul>
                            <div class="page" id="p1">
                                <section class="icon">
                                    <div class='nitai-box'>
                                        <img src="img/favicon.png" onmouseover="this.src='img/favicon-winter.png'"
                                        onmouseout="this.src='img/favicon.png'" 
                                        style="width: 150px;">
                                    </div>
                                    <span id="hit1" class="hint typewriter">Welcome to my web...</span>
                                    <span id="hit2" style="display: none;" class="hint typewriter">学总比不学好，躺着比坐着舒服！</span>
                                    <p class="hint" style="margin-top: 20px;cursor: pointer;"><a href="https://github.com/YINGHAIDADA/" target="_blank">Follow me on Github<span class="fa fa-github"></span></a></p>
                                </section>
                            </div>
                            <div class="page" id="p2">
                                <section class="icon fa fa-keyboard-o" style="width: 80%;height: inherit;top:1em;">
                                    <span class="title">博客</span>
                                    <p class="hint"><a href="blog">点击进入</a></p>
                                    <iframe src="/blog/index.html" class='gallery'></iframe>
                                </section>
                            </div>
                            <div class="page" id="p3">
                                <section class="icon fa fa-folder">
                                    <span class="title">工程作品</span>
                                </section>
                            </div>
                            <div class="page" id="p4">
                                <section class="icon fa fa-picture-o" style="width: 80%;height: inherit;top:1em;">
                                    <span class="title">渲染/绘画作品</span>
                                    <div class='gallery'>
                                        <!-- <div class='art'><img src="img/art/art1.jpg"></div>
                                        <div class='art'><img src="img/art/art2.jpg"></div>
                                        <div class='art'><img src="img/art/art3.jpg"></div>
                                        <div class='art'><img src="img/art/art4.png"></div>
                                        <div class='art'></div>
                                        <div class='art'></div> -->
                                        <div class="options">
                                            <div class="option active" style="--optionBackground:url(https://s1.ax1x.com/2022/11/26/ztxABD.jpg);">
                                               <div class="shadow"></div>
                                               <div class="label">
                                                  <div class="info">
                                                     <div class="info-main">林中小屋</div>
                                                     <div class="info-sub">18年的临摹改编绘画-Procreate创作</div>
                                                  </div>
                                               </div>
                                            </div>
                                            <div class="option" style="--optionBackground:url(https://s1.ax1x.com/2022/11/26/ztxK3t.jpg);">
                                               <div class="shadow"></div>
                                               <div class="label">
                                                  <div class="info">
                                                     <div class="info-main">警察局</div>
                                                     <div class="info-sub">19年的绘画-Procreate创作</div>
                                                  </div>
                                               </div>
                                            </div>
                                            <div class="option" style="--optionBackground:url(https://s1.ax1x.com/2022/11/26/ztxQjf.jpg);">
                                               <div class="shadow"></div>
                                               <div class="label">
                                                  <div class="info">
                                                     <div class="info-main">街景</div>
                                                     <div class="info-sub">19年的绘画-Procreate创作</div>
                                                  </div>
                                               </div>
                                            </div>
                                            <div class="option" style="--optionBackground:url(https://s1.ax1x.com/2022/11/26/ztxm4A.jpg);">
                                               <div class="shadow"></div>
                                               <div class="label">
                                                  <div class="info">
                                                     <div class="info-main">港式楼房</div>
                                                     <div class="info-sub">19年的速写绘画-Procreate创作</div>
                                                  </div>
                                               </div>
                                            </div>
                                            <div class="option" style="--optionBackground:url(https://s1.ax1x.com/2022/11/26/ztxMgP.jpg);">
                                               <div class="shadow"></div>
                                               <div class="label">
                                                  <div class="info">
                                                     <div class="info-main">鬼灭之刃</div>
                                                     <div class="info-sub">动漫周边绘画-Procreate创作</div>
                                                  </div>
                                               </div>
                                            </div>
                                            <div class="option" style="--optionBackground:url(https://s1.ax1x.com/2022/11/26/ztxeNd.jpg);">
                                                <div class="shadow"></div>
                                                <div class="label">
                                                   <div class="info">
                                                      <div class="info-main">飞出矿洞</div>
                                                      <div class="info-sub">为网易Minecraft社区制作的壁纸-C4D渲染</div>
                                                   </div>
                                                </div>
                                            </div>
                                            <div class="option" style="--optionBackground:url(https://s1.ax1x.com/2022/11/26/ztxZAH.jpg);">
                                                <div class="shadow"></div>
                                                <div class="label">
                                                   <div class="info">
                                                      <div class="info-main">跳入火海</div>
                                                      <div class="info-sub">16年的时候刚入门渲染时的创作-C4D渲染</div>
                                                   </div>
                                                </div>
                                            </div>
                                         </div>
                                    </div>
                                </section>                
                            </div>
                            <div class="page" id="p5">
                                <section class="icon fa fa-camera-retro" style="width: 80%;height: inherit;top:1em;">
                                    <span class="title">摄影作品</span>
                                    <p class="hint"></p>
                                    <iframe src="/data/camera_gallery.html" class='gallery'></iframe>
                                </section>
                            </div>
                            <div class="page" id="p6">
                                <section class="icon fa fa-plus-circle">
                                    <span class="title">More</span>
                                    <p class="hint">
                                        
                                    </p>
                                </section>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</body>

</html>
